<template>
	<view class="content">
		<view class="sousou">
			<u-search placeholder="搜索" disabled @click="goSearch" bgColor="#f2f2f2" borderColor="#fff" :showAction="false"></u-search>
		</view>
		
		<view class="goodsList">
			<block v-for="(item,index) in productList" :key="index">
				<view class="goodLi" @click="goDetail(item)">
					<view class="gdImg">
						<image :src="item.fengImg" mode=""></image>
					</view>
					<text class="pName">{{language == 'zh_CN'?item.product_name:item.product_egname}}</text>
					<text class="datee">{{item.createTime}}</text>
				</view>
			</block>
		</view>
	</view>
</template>

<script>
	import baseUrl from '@/utils/config.js';
	import { getProductList } from '@/api/login.js';
	export default {
		data() {
			return {
				language: '',
				countPage: '',
				imgUrl: baseUrl,
				productList: [],
				queryItem:{
					pageNum: 1,
					pageSize: 10,
					type_id: ''
				}
			}
		},
		onShow() {
			this.language = this.$i18n.locale;	
		},
		onLoad(opt) {
			this.queryItem.type_id = opt.bm_id;
			this.getGoodsList();
		},
		onReachBottom() {
			if(this.queryItem.pageNum < this.countPage) {
				this.queryItem.pageNum ++;
				this.getGoodsList(1);
			}
		},
		methods: {
			// 获取产品列表
			getGoodsList(val) {
				getProductList(this.queryItem).then(res=>{
					this.countPage = Math.ceil(parseInt(res.total)/parseInt(this.queryItem.pageSize));
					res.rows.forEach(item=>{
						item.fengImg = baseUrl + item.product_img.split(',')[0]
					});
					if(val != undefined) {
						this.productList = this.productList.concat(res.rows);
					} else {
						this.productList = res.rows;
					}	
				})
			},
			// 跳转到详情
			goDetail(val) {
				uni.navigateTo({
					url:`/pages/detail/detail?id=${val.id}`
				});
			},
			// 跳转到搜索页
			goSearch() {
				uni.navigateTo({
					url:'/pages/search/search'
				})
			},
		}
	}
</script>

<style scoped lang="scss">
.content{
	.sousou{
		padding:0 25rpx 20rpx;
	}
	.goodsList{
		background-color: #f2f2f2;padding:20rpx 25rpx;
		@include flx;flex-wrap: wrap;justify-content: space-between;
		.goodLi{
			width: 48%;border:1px solid #ddd;border-radius: 15rpx;padding-bottom: 20rpx;margin-bottom:20rpx;
			background-color:#fff;
			.gdImg{
				image{
					width: 100%;border-radius: 15rpx 15rpx 0 0;
				}
			}
			text{
				display: block;@include baseFont(28rpx,#000,40rpx);padding:0 10rpx;
			}
			.pName{
				margin-top:10rpx;
			}
			.datee{
				color:#666;font-size:20rpx;
			}
		}
	}
}
</style>
